import { Component } from '@angular/core';
import {NgClass} from '@angular/common';
import {Class} from './class';

@Component({
  selector: 'app-root',
  templateUrl: './app.html',
  imports: [
    NgClass,
    Class
  ],
  styleUrl: './app.css'
})
export class App {
  protected title = 'pages';

  currentPage = 0;
  images=[
    {
      title:'At the Beach',
      url:'https://q3.itc.cn/images01/20241102/67184c516e0842f2a0f65e5059eef4d0.jpeg'
    },
    {
      title:'At the Forest',
      url:'https://img95.699pic.com/xsj/02/2i/85.jpg!/fw/700/watermark/url/L3hzai93YXRlcl9kZXRhaWwyLnBuZw/align/southeast'
    },
    {
      title:'At the City',
      url:'https://img1.baidu.com/it/u=3809930774,2485336633&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=657'
    },
    {
      title:'At the Snow',
      url:'https://img2.baidu.com/it/u=3273291086,4082176286&fm=253&app=138&f=JPEG?w=800&h=1067'
    },
    {
      title:'At the Beach',
      url:'https://q3.itc.cn/images01/20241102/67184c516e0842f2a0f65e5059eef4d0.jpeg'
    },
    {
      title:'At the Forest',
      url:'https://img95.699pic.com/xsj/02/2i/85.jpg!/fw/700/watermark/url/L3hzai93YXRlcl9kZXRhaWwyLnBuZw/align/southeast'
    },
    {
      title:'At the City',
      url:'https://img1.baidu.com/it/u=3809930774,2485336633&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=657'
    },
    {
      title:'At the Snow',
      url:'https://img2.baidu.com/it/u=3273291086,4082176286&fm=253&app=138&f=JPEG?w=800&h=1067'
    },
    {
      title:'At the Beach',
      url:'https://q3.itc.cn/images01/20241102/67184c516e0842f2a0f65e5059eef4d0.jpeg'
    },
    {
      title:'At the Forest',
      url:'https://img95.699pic.com/xsj/02/2i/85.jpg!/fw/700/watermark/url/L3hzai93YXRlcl9kZXRhaWwyLnBuZw/align/southeast'
    },
    {
      title:'At the City',
      url:'https://img1.baidu.com/it/u=3809930774,2485336633&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=657'
    },
    {
      title:'At the Snow',
      url:'https://img2.baidu.com/it/u=3273291086,4082176286&fm=253&app=138&f=JPEG?w=800&h=1067'
    },
    {
      title:'At the Beach',
      url:'https://q3.itc.cn/images01/20241102/67184c516e0842f2a0f65e5059eef4d0.jpeg'
    },
    {
      title:'At the Forest',
      url:'https://img95.699pic.com/xsj/02/2i/85.jpg!/fw/700/watermark/url/L3hzai93YXRlcl9kZXRhaWwyLnBuZw/align/southeast'
    },
    {
      title:'At the City',
      url:'https://img1.baidu.com/it/u=3809930774,2485336633&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=657'
    },
    {
      title:'At the Snow',
      url:'https://img2.baidu.com/it/u=3273291086,4082176286&fm=253&app=138&f=JPEG?w=800&h=1067'
    },
    {
      title:'At the Beach',
      url:'https://q3.itc.cn/images01/20241102/67184c516e0842f2a0f65e5059eef4d0.jpeg'
    },
    {
      title:'At the Forest',
      url:'https://img95.699pic.com/xsj/02/2i/85.jpg!/fw/700/watermark/url/L3hzai93YXRlcl9kZXRhaWwyLnBuZw/align/southeast'
    },
    {
      title:'At the City',
      url:'https://img1.baidu.com/it/u=3809930774,2485336633&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=657'
    },
    {
      title:'At the Snow',
      url:'https://img2.baidu.com/it/u=3273291086,4082176286&fm=253&app=138&f=JPEG?w=800&h=1067'
    },
    {
      title:'At the Beach',
      url:'https://q3.itc.cn/images01/20241102/67184c516e0842f2a0f65e5059eef4d0.jpeg'
    },
    {
      title:'At the Forest',
      url:'https://img95.699pic.com/xsj/02/2i/85.jpg!/fw/700/watermark/url/L3hzai93YXRlcl9kZXRhaWwyLnBuZw/align/southeast'
    },
    {
      title:'At the City',
      url:'https://img1.baidu.com/it/u=3809930774,2485336633&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=657'
    },
    {
      title:'At the Snow',
      url:'https://img2.baidu.com/it/u=3273291086,4082176286&fm=253&app=138&f=JPEG?w=800&h=1067'
    }
  ];

  checkWindowIndex(index:number){
    return Math.abs(this.currentPage - index) < 5;
  }

}
